import headeBar from '../../components/headeBar.vue'
import sidebar from '../../components/sidebar.vue'
import {deleteUser, getUserList, postUser, putUser,resetPassword} from '../../api'


export default {
  name: "App",
  data() {
    return {
      activeIndex: 'usermanage',
      userList: [],    // 用户列表
      addUserDialogVisible: false,    // 添加用户模态框
      editUserDialogVisible: false,    // 修改用户模态框
      resetPasswordDialogVisible: false,    // 重置密码模态框
      // 添加用户表单
      addForm: {
        code: '',    // 工号
        username: '',    // 姓名
        is_admin: false,    // 是否是管理员
        password: '',    // 密码
      },

      // 修改用户表单
      editForm: {
        id: '',
        code: '',    // 工号
        username: '',    // 姓名
        is_admin: '',    // 是否是管理员
        is_active: '',    // 是否启用
      },

      // 重置密码表单
      passwordForm: {
        id: '',
        password: ''
      },
      ifFormFlag: false,    // 判断是否有未处理完的操作
      resetPasswordUser: ''    // 要重置密码的用户名
    };
  },
  methods: {
    // 获取所有用户
    async getUserList() {
      let res = await getUserList();
      if (res.status === 200) {
        this.userList = res.data.map(function (item) {
          if (item.isAdmin) {
            item.isAdmin = '是';
            item.is_admin = true;
          } else {
            item.isAdmin = '否';
            item.is_admin = false;
          }
          if (item.isActive) {
            item.isActive = '启用';
            item.is_active = true;
          } else {
            item.isActive = '已禁用';
            item.is_active = false;
          }
          return item;
        });
      } else if (res.status === 401 || res.status === 403) {    // 登录超时，跳转到登录页
        this.$router.push({path: '/login', query: {to: this.$route.path}});
      } else {
        if (res.data.non_field_errors) {
          this.$message.error(res.data.non_field_errors[0]);
        } else {
          this.$message.error(res.detail);
        }
      }

    },

    // 添加用户模态框
    addUser() {
      this.addForm = {};
      this.addUserDialogVisible = true
    },

    //修改用户模态框
    editUser(scope) {
      this.editForm.id = scope.row.id;
      this.editForm.code = scope.row.code;
      this.editForm.username = scope.row.username;
      this.editForm.is_admin = scope.row.is_admin;
      this.editForm.is_active = scope.row.is_active;
      this.editUserDialogVisible = true
    },

    // 删除用户
    delUser(scope) {
      this.$confirm('此操作将永久删除该用户, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let res = await deleteUser(scope.row.id);
        if (res.status === 204) {
          this.getUserList();
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        } else if (res.status === 404) {
          this.$message.error('该用户不存在')
        } else {
          if (res.data.non_field_errors) {
            this.$message.error(res.data.non_field_errors[0]);
          } else {
            this.$message.error(res.data.detail);
          }
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    // 重置密码
    resetPassword(scope) {
      this.resetPasswordUser = scope.row.username;
      this.passwordForm.id = scope.row.id;
      this.passwordForm.password = '';
      this.resetPasswordDialogVisible = true;
    },

    // 标记已被禁用的用户
    tableRowClass({row, rowIndex}) {
      if (row.isActive ==='已禁用') {
        return 'error-row';
      }
      return '';
    },

    // post_user
    async postUser(){
      //防止重复提交
      if(this.ifFormFlag){
        return this.$message.warning('正在处理，请不要重复提交');
      }
      if(!this.addForm.code|| !this.addForm.username || !this.addForm.password ){
        return this.$message.error('输入有误，请核对信息');
      }
      else {
        // 开始提交数据
        let data = {
          code: this.addForm.code,
          username: this.addForm.username,
          is_admin: this.addForm.is_admin ? this.addForm.is_admin: false,
          password: this.addForm.password
        };
        this.ifFormFlag = true;
        let res = await postUser(data);
        this.ifFormFlag = false;
        if (res.status === 201) {
          this.getUserList();
          this.$message.success('操作成功');
          this.addUserDialogVisible = false;
          this.addForm.is_admin = false;
        } else if (res.status === 401 || res.status === 403) {    // 登录超时，跳转到登录页
          this.$router.push({path: '/login', query: {to: this.$route.path}});
        } else {    // 提示错误消息
          if (res.data.non_field_errors) {
            this.$message.error(res.data.non_field_errors[0]);
          } else {
            this.$message.error(res.data.detail);
          }
        }
      }
    },

    // put_user
    async putUser(){
      //防止重复提交
      if(this.ifFormFlag){
        return this.$message.warning('正在处理，请不要重复提交');
      }
      if(!this.editForm.code|| !this.editForm.username || !this.editForm.id ){
        return this.$message.error('输入有误，请核对信息');
      }
      else {
        // 开始提交数据

        this.ifFormFlag = true;
        let res = await putUser(this.editForm);
        this.ifFormFlag = false;
        if (res.status === 201) {
          this.getUserList();
          this.$message.success('操作成功');
          this.editUserDialogVisible = false;

        } else if (res.status === 401 || res.status === 403) {    // 登录超时，跳转到登录页
          this.$router.push({path: '/login', query: {to: this.$route.path}});
        } else {    // 提示错误消息
          if (res.data.non_field_errors) {
            this.$message.error(res.data.non_field_errors[0]);
          } else {
            this.$message.error(res.data.detail);
          }
        }
      }
    },

    // put_new_password
    async putNewPassword(){
      //防止重复提交
      if(this.ifFormFlag){
        return this.$message.warning('正在处理，请不要重复提交');
      }
      if(!this.passwordForm.password || !this.passwordForm.id){
        return this.$message.error('请输入密码');
      }
      else {
        // 开始提交数据
        this.ifFormFlag = true;
        let res = await resetPassword(this.passwordForm);
        this.ifFormFlag = false;
        if (res.status === 201) {
          this.$message.success('操作成功');
          this.resetPasswordDialogVisible = false;

        } else if (res.status === 401 || res.status === 403) {    // 登录超时，跳转到登录页
          this.$router.push({path: '/login', query: {to: this.$route.path}});
        } else {    // 提示错误消息
          if (res.data.non_field_errors) {
            this.$message.error(res.data.non_field_errors[0]);
          } else {
            this.$message.error(res.data.detail);
          }
        }
      }
    },
  },
  computed: {
    resetPasswordTitle(){
      return '重置' + this.resetPasswordUser + '的密码';
    }
  },
  components: {
    headeBar,
    sidebar
  },
  created(){
    this.getUserList();
  }
}
